<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="字典列表" width="800px">
    <BasicTable @register="registerTable" :rowClassName="getRowClassName">
      <template v-slot:bodyCell="{column, record, index}">
        <template v-if="column.dataIndex ==='action'">
          <TableAction :actions="getTableAction(record)" />
        </template>
      </template>
    </BasicTable>
    
    <!-- 表单区域 -->
    <!-- 动火-->
    <TbJobTicketModalHotWork ref="registerModalHotWork" @success="refresh" />
    <!-- 临时用电-->
    <TbJobTicketModalTemporaryElectricityConsumption ref="registerModalTemporaryElectricityConsumption" @success="refresh" />
    <!-- 受限空间-->
    <TbJobTicketModalRestrictedSpace ref="registerModalRestrictedSpace" @success="refresh" />
    <!-- 吊装-->
    <TbJobTicketModalLifting ref="registerModalLifting" @success="refresh" />
    <!-- 高处-->
    <TbJobTicketModalHigh ref="registerModalHigh" @success="refresh" />
    <!-- 盲板-->
    <TbJobTicketModalBlindPlate ref="registerModalBlindPlate" @success="refresh" />
    <!-- 动土-->
    <TbJobTicketModalBreakGround ref="registerModalBreakGround" @success="refresh" />
    <!-- 断路-->
    <TbJobTicketModalOpenCircuit ref="registerModalOpenCircuit" @success="refresh" />
  </BasicDrawer>
</template>
<script lang="ts" setup>
  import { ref, unref } from 'vue';
  import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
  import { BasicTable, useTable, TableAction } from '/src/components/Table';
  import { useDesign } from '/@/hooks/web/useDesign';
  import { dictItemJobTypeColumns, dictItemJobTypeSearchFormSchema } from '@/views/system/dict/dict.data';
  import { getDictItemsByCode } from '@/views/system/dict/dict.api';
  import { ColEx } from '/@/components/Form/src/types';
  
  import TbJobTicketModalHotWork from './TbJobTicketModalHotWork.vue'
  import TbJobTicketModalTemporaryElectricityConsumption from './TbJobTicketModalTemporaryElectricityConsumption.vue'
  import TbJobTicketModalRestrictedSpace from './TbJobTicketModalRestrictedSpace.vue'
  import TbJobTicketModalLifting from './TbJobTicketModalLifting.vue'
  import TbJobTicketModalHigh from './TbJobTicketModalHigh.vue'
  import TbJobTicketModalBlindPlate from './TbJobTicketModalBlindPlate.vue'
  import TbJobTicketModalBreakGround from './TbJobTicketModalBreakGround.vue'
  import TbJobTicketModalOpenCircuit from './TbJobTicketModalOpenCircuit.vue'
  import { queryJobCode } from '../TbJobTicket.api';
  import { useUserStore } from '/@/store/modules/user';
  import dayjs from 'dayjs';

  const { prefixCls } = useDesign('row-invalid');
  const dictCode = ref('');
  //字典配置model
  const [registerDrawer,{ setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
    dictCode.value = data.code;
    setProps({ searchInfo: { dictCode: unref(dictCode) } });
    reload();
  });
  // 自适应列配置
  const adaptiveColProps: Partial<ColEx> = {
    xs: 24, // <576px
    sm: 24, // ≥576px
    md: 24, // ≥768px
    lg: 12, // ≥992px
    xl: 12, // ≥1200px
    xxl: 8, // ≥1600px
  };
  const [registerTable, { reload, setProps }] = useTable({
    //需要配置rowKey，否则会有警告
    rowKey:'value',
    api: getDictItemsByCode,
    columns: dictItemJobTypeColumns,
    formConfig: {
      baseColProps: adaptiveColProps,
      labelAlign: 'right',
      labelCol: {
        offset: 1,
        xs: 24,
        sm: 24,
        md: 24,
        lg: 9,
        xl: 7,
        xxl: 4,
      },
      wrapperCol: {},
      schemas: dictItemJobTypeSearchFormSchema,
      autoSubmitOnEnter: true,
      actionColOptions: {
        span: 8
      }
    },
    striped: true,
    useSearchForm: true,
    bordered: true,
    showIndexColumn: false,
    canResize: false,
    immediate: false,
    actionColumn: {
      width: 100,
      title: '操作',
      dataIndex: 'action',
      //slots: { customRender: 'action' },
      fixed: undefined,
    },
  });
  // Emits声明
  const emit = defineEmits(['register', 'success']);
  const userStore = useUserStore();
  const registerModalHotWork = ref();
  const registerModalTemporaryElectricityConsumption = ref();
  const registerModalRestrictedSpace = ref();
  const registerModalLifting = ref();
  const registerModalHigh = ref();
  const registerModalBlindPlate = ref();
  const registerModalBreakGround = ref();
  const registerModalOpenCircuit = ref();

  /**
   * 成功回调
   */
  function refresh() {
    closeDrawer();
    emit('success');
  }

  /**
   * 编辑
   */
  function handleMake(selectRow){
    /* 这里传参使用从作业活动页面传过来的对象数据，然后需要将单个的作业类型赋值，重新传参*/
    /* 动火作业：1，临时用电：2，吊装作业：3，盲板抽堵：4，动土作业：5，
      断路作业：6，受限空间作业：7，高处作业：8，通用作业：9，带压堵漏：10*/
      /* 获取编号之后再进行页面渲染*/
    queryJobCode({}).then((result) => {
      console.log("-----userStore.getUserInfo--------"+JSON.stringify(userStore))
      const jobData = {
        jobType: selectRow.value,
        applyCompany: userStore.getUserInfo.orgCode,
        applicant: userStore.getUserInfo.username,
        //applyTime: dayjs(new Date()).format('YYYY-MM-DD hh:mm:ss'),
        number: result,
      }
      
      console.log("-----jobData------"+JSON.stringify(jobData))
      if(selectRow.value == "1"){
        registerModalHotWork.value.disableSubmit = false;
        registerModalHotWork.value.edit(jobData);
      }else if(selectRow.value == "2"){
        registerModalTemporaryElectricityConsumption.value.disableSubmit = false;
        registerModalTemporaryElectricityConsumption.value.edit(jobData);
      }else if(selectRow.value == "3"){
        registerModalLifting.value.disableSubmit = false;
        registerModalLifting.value.edit(jobData);
      }else if(selectRow.value == "4"){
        registerModalBlindPlate.value.disableSubmit = false;
        registerModalBlindPlate.value.edit(jobData);
      }else if(selectRow.value == "5"){
        registerModalBreakGround.value.disableSubmit = false;
        registerModalBreakGround.value.edit(jobData);
      }else if(selectRow.value == "6"){
        registerModalOpenCircuit.value.disableSubmit = false;
        registerModalOpenCircuit.value.edit(jobData);
      }else if(selectRow.value == "7"){
        registerModalRestrictedSpace.value.disableSubmit = false;
        registerModalRestrictedSpace.value.edit(jobData);
      }else if(selectRow.value == "8"){
        registerModalHigh.value.disableSubmit = false;
        registerModalHigh.value.edit(jobData);
      }
    });
  }

  /**
   * 操作栏
   */
  function getTableAction(record) {
    return [
      {
        label: '开票',
        onClick: handleMake.bind(null, record),
      },
    ];
  }
  function getRowClassName(record) {
    return record.status == 0 ? prefixCls : '';
  }
</script>
<style scoped lang="less">
  @prefix-cls: ~'@{namespace}-row-invalid';

  :deep(.@{prefix-cls}) {
    background: #f4f4f4;
    color: #bababa;
  }
</style>
